<html>
    <head>
        <title>MasterStroke - Home</title>
        <script src="Client/lib/jquery.js"></script>        
        <link href="css/main.css" rel="stylesheet" />
        <link href="css/m-styles.min.css" rel="stylesheet">
        <script data-main="Client/main" src="Client/require.js"></script>
        <script type="text/javascript">
            require
            (
                ["MasterStroke/ViewModels/IndexViewModel"],
                function()
                {                    
                    var viewModel = new MasterStroke.ViewModels.IndexViewModel();
                    viewModel.start();
                }
            );
        </script>
    </head>
    <body>
        <div id="mainContent" class="vertically-center">            
            <img src="images/logo.png"/>
            <span class="toolbar">
                <div class="m-btn-group" style="margin-left: 300px; margin-top: 10px; vertical-align:top;">
                    <a href="/create" class="m-btn blue-stripe">Create a new flipbook</a>
                    <a href="/about" class="m-btn ">About</a>
                </div>
            </span>
            <div><img src="images/title-slogan.png"/></div>                            
        </div>
    </body>
</html>